<template>
  <view class="pa-4">
    <view class="pa-2" style="margin-top: 18vh; margin-bottom: 30px">
      <image width="48" style="width: 80px; height: 80px; margin-bottom: -24px" src="@/assets/images/logo.png" />
      <text style="font-size: 40px; font-weight: bold">抖带选</text>
      <text style="font-size: 12px; padding-left: 10px">达人流量变现平台</text>
    </view>
    <view class="pl-3">为了给您提供更好的服务，请授权以下权限 </view>
    <view class="pl-3 pt-2 tip-text">获取您的公开信息（昵称、头像等）</view>
    <view class="dpc-center-center mt-2">
      <nut-button
        class="full-width"
        type="primary"
        :disabled="!agree || loginLoading"
        :loading="loginLoading"
        @click="handleLogin"
        >{{ authorizeText }}</nut-button
      >
      <view class="mt-3 dpr-center-center" style="font-size: 14px">
        <nut-checkbox v-model="agree">
          <view>
            <text>我已阅读并同意</text>
          </view>
        </nut-checkbox>
        <view style="color: #fa2c19" @click="Taro.navigateTo({ url: '/pages/agreement/index?type=ua&title=用户协议' })"
          >《用户协议》</view
        >
        <text>和</text>
        <view style="color: #fa2c19" @click="Taro.navigateTo({ url: '/pages/agreement/index?type=pa&title=隐私协议' })"
          >《隐私协议》</view
        >
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import Taro from '@tarojs/taro';
import { ref } from 'vue';
import { wechatLoginApi } from '@/api/authorize';
import { getPersonalInfoApi } from '@/api/user';
import { backOrToHome } from '@/utils/router';

const authorizeText = ref('微信授权登录');
const loginLoading = ref(false);
const agree = ref(false);

const handleLogin = () => {
  loginLoading.value = true;
  const loginData = {
    vi: '',
    code: '',
    encryptedData: '',
    rawData: '',
    signature: '',
    cloudID: '',
    userInfo: {},
  };

  Taro.getUserProfile({
    desc: '用以获取用户昵称、头像等',
    lang: 'zh_CN',
    fail: () => {
      loginLoading.value = false;
    },
    success: (res) => {
      console.log('获取个人资料', res);
      loginData.vi = res.iv;
      loginData.encryptedData = res.encryptedData;
      loginData.rawData = res.rawData;
      loginData.signature = res.signature;
      loginData.userInfo = res.userInfo;
      Taro.login({
        success: (ret) => {
          loginData.code = ret.code;
          wechatLoginApi(loginData)
            .then((r) => {
              console.log('请求后台', r);
              if (r.success) {
                authorizeText.value = '登录成功';
                console.log('获取token成功');
                Taro.setStorageSync('refresh_token', r.result.refresh_token);
                Taro.setStorage({
                  key: 'access_token',
                  data: r.result.access_token,
                  success: (ok) => {
                    console.log('登录成功', ok);
                    getPersonalInfoApi({})
                      .then((res) => {
                        Taro.setStorageSync('user_info', res.result);
                      })
                      .finally(() => {
                        Taro.navigateBack({
                          delta: 1,
                          fail: () => {
                            Taro.switchTab({ url: '/pages/tabbar/user/index' });
                          },
                        });
                      });
                  },
                }).then();
              }
            })
            .finally(() => {
              loginLoading.value = false;
            })
            .then();
        },
      });
    },
    complete: () => {},
  });
};
</script>

<style lang="less" scoped></style>
